<template>
  <div id="app-container" style="padding:30px;">

    <el-form label-width="130px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="优先级">
            <el-select v-model="dispOrd.priority" clearable placeholder="请选择">
              <el-option :value="1" label="一级"/>
              <el-option :value="2" label="二级"/>
              <el-option :value="3" label="三级"/>
              <el-option :value="4" label="四级"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="专业类型">
            <el-select v-model="dispOrd.specType" clearable placeholder="请选择">
              <el-option :value="1" label="生产调度指令"/>
              <el-option :value="2" label="安全调度指令"/>
              <el-option :value="3" label="开工调度指令"/>
              <el-option :value="4" label="培训调度指令"/>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="指令名称">
            <el-input v-model="dispOrd.orderName"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="指令描述">
            <el-input v-model="dispOrd.orderDesc" :rows="10" type="textarea"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="3" :offset="5">
          <el-form-item>
            <el-button :disabled="saveBtnDisabled" type="primary" @click="saveDispOrd()">保存</el-button>
          </el-form-item>
        </el-col>
        <el-col :span="3">
          <el-form-item>
            <el-button type="primary" @click="createDialogVisible = false">返回</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

  </div>
</template>

<script>
import dispord from "@/api/pms/dispord";
export default {
  data() {
    return {
      dispOrd: {
      },
      saveBtnDisabled: false
    }
  },

  created() {
    this.init()
  },

  methods: {
    // 页面一加载 就获得选中的id
    init() {
      if (this.$route.params && this.$route.params.id){
        console.log(this.$route.params.id)
        let dispOrdId = this.$route.params.id
        this.getDisOrd(dispOrdId)
      }
    },
    //调用js文件中的接口方法 response代表后端到前端的数据 展示 R类型的
      getDisOrd(dispOrdId){
        dispord.getDispOrdById(dispOrdId)
          .then(response => {
              this.dispOrd = response.data.dispOrd
          })
      },
    // 保存方法
    saveDispOrd(){
      // 禁用按钮
      this.saveBtnDisabled = true
      dispord.updateDisOrd(this.dispOrd)
      .then(response => {
          // 消息提示
        this.$message({
          type: 'success',
          message: '保存成功'
        })
        // 返回list页面 对称的
        this.$router.push('/dispord/list')
      })
    }
  }
}
</script>

